<template>
  <div class="page-wrapper">
    <c-card title="设备详情" class="user-list">
      <div slot="func">导出</div>
      <div>
        <el-form :model="device" label-width="60px" class="demo-ruleForm" label-position="top">
          <div>
            <h3>简要信息</h3>
            <div class="row" style="margin-bottom: 22px;">
              <div class="dev-img">
                <img src="@/assets/401_images/401.gif" alt style="width: 300px; height: 200px;" />
              </div>
              <div style="flex-grow: 1">
                <div class="form-row">
                  <div class="row-item">
                    <el-form-item label="设备名称" prop="name">
                      <el-input v-model="device.name" size="small"></el-input>
                    </el-form-item>
                  </div>
                  <spliter />
                  <div class="row-item">
                    <el-form-item label="品牌信息" prop="processDefId">
                      <el-select v-model="device.processDefId" size="small"></el-select>
                    </el-form-item>
                  </div>
                </div>
                <div class="form-row">
                  <div class="row-item">
                    <el-form-item label="规格型号" prop="name">
                      <el-input v-model="device.name" size="small"></el-input>
                    </el-form-item>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div>
            <h3>基本信息</h3>
            <div class="form-row">
              <div class="row-item">
                <el-form-item label="设备分类" prop="priorityId">
                  <el-input v-model="device.priorityId" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="资产编码（业主）" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="型号分类（品种）" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
            </div>
            <div class="form-row">
              <div class="row-item">
                <el-form-item label="产品序列号" prop="priorityId">
                  <el-input v-model="device.priorityId" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="设备等级" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="购买价" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
            </div>
            <div class="form-row">
              <div class="row-item">
                <el-form-item label="材质" prop="priorityId">
                  <el-input v-model="device.priorityId" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="是否新件" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item"></div>
            </div>
            <div class="form-row">
              <div class="row-item">
                <el-form-item label="描述" prop="priorityId">
                  <el-input v-model="device.priorityId" type="textarea" size="small"></el-input>
                </el-form-item>
              </div>
            </div>
          </div>
          <div>
            <h3>位置信息</h3>
            <div class="form-row">
              <div class="row-item">
                <el-form-item label="产权单位" prop="priorityId">
                  <el-input v-model="device.priorityId" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="所属站点" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="设备位置" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
            </div>
          </div>
          <div>
            <h3>产权信息</h3>
            <div class="form-row">
              <div class="row-item">
                <el-form-item label="管理单位" prop="priorityId">
                  <el-input v-model="device.priorityId" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="管理部门" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="责任部门" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
            </div>
            <div class="form-row">
              <div class="row-item">
                <el-form-item label="使用部门" prop="priorityId">
                  <el-input v-model="device.priorityId" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="责任人" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="安装日期" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
            </div>
            <div class="form-row">
              <div class="row-item">
                <el-form-item label="购买日期" prop="priorityId">
                  <el-input v-model="device.priorityId" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="开始使用日期" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="使用年限" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
            </div>
            <div class="form-row">
              <div class="row-item">
                <el-form-item label="设备工作状态" prop="priorityId">
                  <el-input v-model="device.priorityId" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item"></div>
              <spliter />
              <div class="row-item"></div>
            </div>
          </div>
          <div>
            <h3>供应商信息</h3>
            <div class="form-row">
              <div class="row-item">
                <el-form-item label="生产商" prop="priorityId">
                  <el-input v-model="device.priorityId" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="供应商" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="制造别国" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
            </div>
            <div class="form-row">
              <div class="row-item">
                <el-form-item label="出厂日期" prop="priorityId">
                  <el-input v-model="device.priorityId" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="保修开始日期" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="保修终止日期" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
            </div>
            <div class="form-row">
              <div class="row-item">
                <el-form-item label="出厂编号" prop="priorityId">
                  <el-input v-model="device.priorityId" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item">
                <el-form-item label="图号" prop="days">
                  <el-input v-model="device.days" size="small"></el-input>
                </el-form-item>
              </div>
              <spliter />
              <div class="row-item"></div>
            </div>
          </div>
          <div class="row-center">
            <el-button size="small" @click="goBack">返回</el-button>
            <spliter width="100" />
            <el-button type="danger" size="small">提交</el-button>
          </div>
        </el-form>
      </div>
    </c-card>
  </div>
</template>

<script>
import CCard from "@/components/CCard";
import Spliter from "@/components/Spliter";
export default {
  components: {
    CCard,
    Spliter
  },
  data() {
    return {
      device: {}
    };
  },
  methods: {
    goBack() {
      this.$store
        .dispatch("tagsView/delView", this.$route)
        .then(() => this.$router.back());
    }
  }
};
</script>

<style lang="scss" scoped>
h3 {
  margin: 30px 0 20px;
}

.dev-img {
  margin-right: 22px;
}
</style>
